<template>
  <div v-if="form.carPurchaseSource ==1">
    <div class="card-wrap flex-column justify-end card-padding">
      <el-form :model="form" ref="purchaseTax" label-width="140px" :rules="type =='detail'?{}:rules" :label-position="type =='detail'?'right':'top'">
        <div class="card-title-wrap">
          <span>购置税信息</span>
          <span></span>
        </div>
        <div style="box-sizing: border-box;padding-left: 20px;">
          <el-row>
            <el-col :span="8">
              <el-form-item label="购置税时效:" prop="dateRange" style="width: 80%;">
                <el-date-picker v-if="type !=='detail'" v-model="form.dateRange" type="daterange" @change="changeTime" value-format="yyyy-MM-dd" format="yyyy-MM-dd" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
                </el-date-picker>
                <span v-if="type=='detail' && form.purchaseStartTime && form.purchaseEndTime">{{form.purchaseStartTime}} 至 {{form.purchaseEndTime}}</span>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="购置税费用:" prop="purchaseMoney" style="width: 80%;">
                <el-input @input="form.purchaseMoney=form.purchaseMoney.replace(/^\D*([0-9]\d*\.?\d{0,2})?.*$/,'$1')" v-if="type !=='detail'" v-model="form.purchaseMoney" maxlength="15" clearable></el-input>
                <span v-if="type=='detail'">{{format_thousand(form.purchaseMoney)}}</span>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col>
              <el-form-item label="购置税发票:" prop="purchaseFile">
                <ImageCommon :up-type="2" info="选择附件" :limit="5" v-model="form.purchaseFile" :disabled="type=='detail'"></ImageCommon>
              </el-form-item>
            </el-col>
          </el-row>
        </div>
      </el-form>

    </div>

  </div>
</template>
  <script>
export default {
  name: "PurchaseTax",
  props: {
    value: {
      type: Object,
      default: {},
    },
    state: {
      type: String,
      default: "",
    },
  },
  dicts: ["business_yes_no"],
  created() {
    console.log([this.form.purchaseStartTime, this.form.purchaseEndTime]);
    this.form.purchaseStartTime && this.form.purchaseEndTime && this.$set(this.form, 'dateRange', [this.form.purchaseStartTime, this.form.purchaseEndTime])
  },
  computed: {
    form: {
      get() {
        return this.value;
      },
      set(val) {
        this.$emit("input", val);
      },
    },
    type() {
      let status;
      switch (this.state) {
        case "write":
          status = "edit";
          break;
        case "disabled":
          status = "detail";
          break;
        case "readonly":
          status = "detail";
          break;
        case "detail":
          status = "detail";
          break;
        case "edit":
          status = "edit";
        case "add":
          status = "add";
          break;
      }
      return status;
    },
  },
  data() {
    return {
      rules: {
        dateRange: [
          {
            type: 'array',
            required: true,
            message: '请选择购置税时效',
            fields: {
              0: { type: 'string', required: true, message: '请选择开始日期' },
              1: { type: 'string', required: true, message: '请选择结束日期' }
            }
          }
        ],
        purchaseMoney: [
          { required: true, message: "请输入购置税费用", trigger: "blur" },
        ],
      },
    };
  },
  methods: {
    // 创建时间发生改变
    changeTime(val) {
      this.form.purchaseStartTime = val && val[0]
      this.form.purchaseEndTime = val && val[1]
    },
    valid() {
      return new Promise(async (resolve) => {
        let result = true;
        let refs = Object.values(this.$refs);
        for (let index = 0; index < refs?.length; index++) {
          const ref = refs[index];
          if (Object.prototype.toString.call(ref) == "[object Array]") {
            for (let i = 0; i < ref.length; i++) {
              const element = ref[i];
              if (element?.valid) {
                let rc = await element?.valid?.();
                result = result && rc;
              }
              if (element?.validate) {
                let rf = await this._valid(ref);
                result = result && rf;
              }
              if (element?.form_validate) {
                let rf = await this._valid(ref, "form_validate");
                result = result && rf;
              }
            }
          } else {
            if (ref?.valid) {
              let rc = await ref?.valid?.();
              result = result && rc;
            }
            if (ref?.validate) {
              let rf = await this._valid(ref);
              result = result && rf;
            }
            if (ref?.form_validate) {
              let rf = await this._valid(ref, "form_validate");
              result = result && rf;
            }
          }
        }
        resolve(result);
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.box {
  width: 100%;
  .title {
    border-left: 3px solid #3280fc;
    padding-left: 5px;
    box-sizing: border-box;
  }
}
.app-container {
  background-color: #fff;
}
</style>
